<script setup lang="ts">

const option = {
  color: 'transparent',
  xAxis: {
    type: 'category',
    axisLabel: {
      color: '#666',
      fontSize: 8,
      rotate: 45,
    },
    data: ['2001年', '2002年', '2003年', '2004年', '2005年', '2006年', '2007年', '2008年', '2009年', '2010年', '2011年', '2012年', '2013年', '2014年'],
    // data: ['类型A', '类型B', '类型C', '类型D', '类型E'],
    axisTick: {
      show: false,
    },
    splitLine: {
      show: true,
      lineStyle: {
        type: 'dashed',
        color: '#666',
      },
    },
    axisLable: {
      show: false,
    },
  },
  yAxis: {
    type: 'value',
    min: 10,
    axisLabel: {
      color: '#999',
    },
    axisTick: {
      show: false,
    },
    splitLine: {
      show: true,
      interval: 2,
      lineStyle: {
        type: 'dashed',
        color: '#666',
      },
    },
    axisLine: {
      show: true,
      lineStyle: {
        type: 'dashed',
      },
    },
  },
  series: [
    {
      data: [
        2845, 2848, 2832, 2958,
        3043, 3068, 3091, 3071,
        3103, 3042, 3107, 3134,
        3200, 3220, 3280,
      ],
      type: 'line',
      color: '#1e829a',
      label: {
        offset: [-30, 40],
      },
    },
    {
      data: [
        2327, 2445, 2518, 2695,
        2906, 3108, 3293, 3422,
        3587, 3590, 3812, 4055,
        4106, 4126, 4117,
      ],
      type: 'line',
      color: '#20959c',
      label: {
        offset: [-30, 40],
      },
    },
    {
      data: [
        1289, 1316, 1342, 1397,
        1443, 1485, 1534, 1562,
        1630, 1584, 1696, 1756,
        1783, 1806, 1823,
      ],
      type: 'line',
      color: '#1d6f98',
      label: {
        offset: [-30, 40],
      },
    },
    {
      data: [
        226, 237, 252, 276,
        298, 320, 356, 382,
        388, 415, 446, 494,
        519, 554, 568,
      ],
      type: 'line',
      color: '#295e8d',
      label: {
        offset: [-30, 40],
      },
    },
    {
      data: [
        46, 47, 49, 48, 54, 60,
        62, 66, 69, 66, 67, 64,
        65, 68, 68,
      ],
      type: 'line',
      color: '#274c8b',
      label: {
        offset: [-30, 40],
      },
    },
  ],
};
</script>

<template>
  <v-chart
    class="chart"
    :option="option"
    autoresize
  />
</template>

<style scoped>
</style>
